<template>
	<label :style="componentModel.cssStyle" :class="componentModel.cssClass">{{label}}<span style="color:red;" v-show="required">*</span></label>
</template>

<script>
	import utils from '@/utils/utils.js';
	export default {
		name: "LabelComponent",
		props: ["componentModel"],
		data() {
			return {
				label: "",
				hasSubmit: false,
				required: false,
				"currentComponentModel":this.componentModel
			}
		},
		inject:['children'],
		mounted() {
			this.children.push(this);
			if (this.componentModel.label != undefined) {
				this.label = this.componentModel.label;
			}
			if (this.componentModel.cssStyle == undefined) {
				this.currentComponentModel.cssStyle = "font-size:14px;";
			}
		},beforeUnmount() {
			utils.removeArrayElement(this.children,this);
		},
		methods: {
			setProp(prop) {
				for (var k in prop) {
					if (k == "value") {
						this.label = prop[k];
						this.hasSubmit = true;
					} else if (k == "required") {
						this.required = prop[k];
					}else if(k=="label"){
						if(!this.hasSubmit){
							this.label = prop[k];
						}
					}
				}
			},
			getValue() {
				if (!this.hasSubmit) {
					return undefined;
				}
				return this.label;
			}
		},
	}
</script>

<style>
</style>
